<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8"/>
    <title>商品列表</title>
    <script type="text/javascript" src="/static/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#commType").find('option[value="${commType!0}"]').prop("selected",true);
            $("#commBrand").find('option[value="${commBrand!0}"]').prop("selected",true);
        });
        window.onload = function () {
            const mySelect = document.getElementById("mySelect");
            const opts = mySelect.options;
            for (let i = 0; i < opts.length; i++) {
                if (opts[i].value == ${state!'-1'}) {
                    opts[i].selected = true;
                }
            }
            const allSelect = document.getElementById("allSelect");
            const commListIds = document.getElementsByName("commListIds");
            allSelect.onchange = function () {
                for (let i = 0; i < commListIds.length; i++) {
                    commListIds[i].checked = allSelect.checked;
                }
            };

            const exportToExcel = document.getElementById("exportToExcel");
            exportToExcel.onclick = function () {
                const arr = [];
                for (let i = 0; i < commListIds.length; i++) {
                    if (commListIds[i].checked) {
                        arr.push(commListIds[i].value);
                    }
                }
                if (arr.length === 0) {
                    alert("还没有选项被选中呢");
                } else {
                    const downloadForm = document.createElement("form");
                    downloadForm.action = "/comm/exportToExcel.do";
                    downloadForm.method = "post";
                    for (let i = 0; i < arr.length; i++) {
                        const input = document.createElement("input");
                        input.type = "checkbox";
                        input.name = "ids";
                        input.value = arr[i];
                        input.style.display = "none";
                        input.checked = true;
                        downloadForm.appendChild(input);
                    }
                    document.body.appendChild(downloadForm);
                    downloadForm.submit();
                }
            }

        }
    </script>
</head>
<body>
<form action="/comm/exportToExcel.do" method="post" id="exportForm">

</form>
<form action="/comm/findComm.do" method="get">
    输入搜索<input type="text" name="commName" value="${commName!''}" placeholder="商品名称"/>
    商品类型：
    <select name="commType" id="commType">
        <option value="0">全部</option>
        <#list types as type>
            <option value="${type.tid}">${type.typeName}</option>
        </#list>
    </select>
    商品品牌：
    <select name="commBrand" id="commBrand">
        <option value="0">全部</option>
        <#list brands as brand>
            <option value="${brand.bid}">${brand.brandName}</option>
        </#list>
    </select>
    商品状态：<select name="state" id="mySelect">
        <option value="-1">全部</option>
        <option value="1">上架</option>
        <option value="0">下架</option>
        <option value="2">促销中</option>
    </select>
    <input type="submit" value="查询结果"/>
</form>
<table cellpadding="5" cellspacing="0" border="1" style="margin-top: 10px">
    <tr>
        <td colspan="3" style="text-align: center">数据列表</td>
        <td colspan="12" style="text-align: right;margin-right: 10px">
            <input type="button" value="添加" onclick="location.href='/comm/goToAddComm'"/>
            <input type="button" value="导出" id="exportToExcel"/>
        </td>
    </tr>
    <tr>
        <th>序号</th>
        <th><input type="checkbox" id="allSelect"/></th>
        <th>商品编码</th>
        <th>商品条形码</th>
        <th>商品名称</th>
        <th>品牌</th>
        <th>商品类型</th>
        <th>销售渠道</th>
        <th>进货价</th>
        <th>成本价</th>
        <th>售价</th>
        <th>库存</th>
        <th>30天销量</th>
        <th>商品状态</th>
        <th>操作</th>
    </tr>
    <#list currentPage.list as data>
        <tr>
            <td>${data.id}</td>
            <th><input type="checkbox" name="commListIds" value="${data.id}"/></th>
            <td>${data.commCode}</td>
            <td>${data.commBarCode}</td>
            <td>${data.commName}</td>
            <td>${data.commBrandBean.brandName}</td>
            <td>${data.commTypeBean.typeName}</td>
            <td>
                <#list data.channelList as channel>
                    ${channel.channelName}&nbsp;&nbsp;
                </#list>
            </td>
            <td>${data.jhPrice}</td>
            <td>${data.cbPrice}</td>
            <td>${data.price}</td>
            <td>${data.stock}</td>
            <td>${data.sales}</td>
            <td>
                <#if data.state == 1>
                    上架
                <#elseif data.state == 2>
                    促销
                <#else>
                    下架
                </#if>
            </td>
            <td>
                <a href="/comm/findCommById.do?id=${data.id}">编辑</a>
                <a href="/comm/view.do?id=${data.id}">查看</a>
            </td>
        </tr>
    </#list>
    <tr>
        <td colspan="8" style="text-align: center">
            <a href="/comm/findComm.do?pageIndex=1&commName=${commName!''}&commBrand=${commBrand!''}&commType=${commType!''}&state=${state!''}">首页</a>
            &nbsp;&nbsp;&nbsp;
            <a href="/comm/findComm.do?pageIndex=${currentPage.prePage}&commName=${commName!''}&commBrand=${commBrand!''}&commType=${commType!''}&state=${state!''}">上一页</a>
            &nbsp;&nbsp;&nbsp;
            <a href="/comm/findComm.do?pageIndex=${currentPage.nextPage}&commName=${commName!''}&commBrand=${commBrand!''}&commType=${commType!''}&state=${state!''}">下一页</a>
            &nbsp;&nbsp;&nbsp;
            <a href="/comm/findComm.do?pageIndex=${currentPage.pages}&commName=${commName!''}&commBrand=${commBrand!''}&commType=${commType!''}&state=${state!''}">尾页</a>
        </td>
        <td colspan="7" style="text-align: center">
            当前${currentPage.pageNum} / ${currentPage.pages}页 每页${currentPage.pageSize}条
        </td>
    </tr>
</table>
</body>
</html>